<template>
	<div>
		<BreadList :list="['Home','Content',{'name':'About'},'Detail']"></BreadList>
		<a-card>
			<h1>{{aboutDetail.aboutTitle}}</h1>
			<div class="markdown-body" v-html="aboutDetail.aboutContent"></div>
		</a-card>
	</div>
</template>

<script>
	import {getAboutById} from '@/api/Content.js'
	export default {
		name: 'AboutDetail',
		data () {
			return {
				aboutDetail: {}
			}
		},
		created() {
			const aboutId = this.$route.query.aboutId
			// 判断 js 字符串为空
			if (aboutId !== undefined) {
				this.getAboutById(aboutId)
			}
		},
		methods: {
			async getAboutById(id) {
				const {data : res} = await getAboutById(id)
				console.log(res)
				if (res.code !== 20000)
					return this.$message.error('加载 About 出错')
				this.aboutDetail = res.data
				var MardownIt = require("markdown-it")
				var md = new MardownIt()
				this.aboutDetail.aboutContent = md.render(this.aboutDetail.aboutContent)
				this.$message.success(res.msg)
			}
		}
	}
</script>

<style>
</style>
